<template>
  <view class="wallet-content">
    <view class="wallet-content-box">
      <view class="wallet-box">
        <view class="wallet-total">
          <view class="wallet-title">
            <text>资产余额（元）</text>
          </view>
          <view class="wallet-money">
            <text>0.00</text>
          </view>
          <view class="income">
            <view class="income-list">
              <text>昨日收益</text>
              <text>+0.00</text>
            </view>
            <view class="income-list">
              <text>累积收益</text>
              <text>0.00</text>
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>

<!--  <view class="wallet-list">-->
<!--    <view class="wallet-list-content">-->
<!--      <view class="wallet-list-box">-->
<!--        <view class="wallet-for-list" v-for="(s, k) in walletData">-->
<!--          <view class="wallet-list-title">-->
<!--            <text v-if="s.type == 0 || s.type == 10" style="font-weight: 900">{{-->
<!--              s.circleName-->
<!--            }}</text>-->
<!--            <text :style="s.isAdd == 0 ? 'color:red' : ''">{{-->
<!--              s.isAdd == 0-->
<!--                ? "-¥" + Number(s.money).toFixed(2)-->
<!--                : "+¥" + Number(s.money).toFixed(2)-->
<!--            }}</text>-->
<!--          </view>-->
<!--          <view class="wallet-status">-->
<!--            <text>{{ getStatusName(s.type) }}</text>-->
<!--          </view>-->
<!--          <view class="wallet-time">-->
<!--            <text>{{ s.createTime }}</text>-->
<!--          </view>-->
<!--        </view>-->
<!--      </view>-->
<!--    </view>-->
<!--  </view>-->


</template>

<script setup>
import { ref } from "vue";
import { onLoad, onReachBottom } from "@dcloudio/uni-app";
import { getBillPage } from "@/api/apiList";
const walletData = ref([]);

const query = ref({
  pageSize: 10,
  pageNum: 1,
});
const getBillData = async () => {
  const getBill = await getBillPage(query.value);
  if (getBill?.code == 200) {
    if (getBill.rows.length) {
      walletData.value = [...walletData.value, ...getBill.rows];
    }
  }
};
getBillData();

const getStatusName = (type) => {
  const statusName = ref("");
  switch (type) {
    case 0:
      statusName.value = "付费入圈";
      break;
    case 1:
      statusName.value = "手机号付费";
      break;
    case 2:
      statusName.value = "顶置付费";
      break;
    case 3:
      statusName.value = "发布动态付费";
      break;
    case 4:
      statusName.value = "推荐文章付费";
      break;
    case 5:
      statusName.value = "充值VIP付费";
      break;
    case 6:
      statusName.value = "评论付费";
      break;
    case 7:
      statusName.value = "顶置付费";
      break;
    case 8:
      statusName.value = "移除圈子退款";
      break;
    case 9:
      statusName.value = "平台扣取服务费";
      break;
    case 10:
      statusName.value = "入圈付费";
      break;
    case 11:
      statusName.value = "顶置收费";
      break;
    case 12:
      statusName.value = "手机号收费";
      break;
  }
  return statusName.value;
};

onReachBottom(() => {
  query.value.pageNum++;
  getBillData();
});
</script>

<style lang="scss" scoped>
.wallet-content {
  margin: 0 30rpx;
  margin-top: 20rpx;

  .wallet-content-box {
    background: white;
    border-radius: 16rpx;
    padding-left: 30rpx;
    padding-top: 34rpx;
    padding-bottom: 38rpx;
    padding-right: 120rpx;

    .wallet-box {
      .wallet-total {
        .wallet-title {
          text {
            font-family: PingFang SC Medium;
            font-size: 11px;
            color: #111111;
          }
        }

        .wallet-money {
          margin-top: 26rpx;
          margin-bottom: 26rpx;

          text {
            font-family: PingFang SC Heavy;
            font-size: 22px;
            color: #111111;
            font-weight: bold;
          }
        }

        .income {
          display: flex;
          align-items: center;
          justify-content: space-between;

          .income-list {
            text {
              font-family: PingFang SC Medium;
              font-size: 12px;
              color: #111111;

              &:nth-last-child(1) {
                color: #0753fd;
                margin-left: 8rpx;
              }
            }
          }
        }
      }
    }
  }
}

.wallet-list {
  margin: 30rpx;
  background: white;
  padding: 50rpx 30rpx;
  border-radius: 20rpx;

  .wallet-list-content {
    .wallet-list-box {
      .wallet-for-list {
        font-family: PingFang SC Regular;
        font-size: 12px;
        color: #999999;
        margin-bottom: 50rpx;
        padding-bottom: 36rpx;
        border-bottom: 1rpx solid #eee;

        &:nth-last-child(1) {
          margin-bottom: 0;
          padding-bottom: 0;
          border-bottom: none;
        }

        .wallet-list-title {
          display: flex;
          align-items: center;
          justify-content: space-between;

          text {
            font-family: PingFang SC Bold;
            font-size: 14px;
            font-weight: bold;
            color: #111111;
          }
        }

        .wallet-status {
          margin: 18rpx 0;
        }
      }
    }
  }
}
</style>
